<template>
    <div>
        <h1>房号新增</h1>

        <table class="table">
            <tr>
                <td>房号</td>
                <td>
                    <input type="text" v-model="data.num">
                </td>
            </tr>

             <tr>
                <td>状态</td>
                <td>
                    <select v-model="data.tid">
                        <option value="0">请选择状态</option>
                        <option v-for="d in xl" :value="d.sid">{{ d.tname }}</option>
                    </select>
                </td>
            </tr>

             <tr>
                <td>电话</td>
                <td>
                    <input type="text" v-model="data.phone">
                </td>
            </tr>

             <tr>
                <td>联系人</td>
                <td>
                    <input type="text" v-model="data.pname">
                </td>
            </tr>

             <tr>
                <td>房型</td>
                <td>
                    <select v-model="data.typeId">
                        <option value="0">请选择房型</option>
                        <option v-for="d in xl2" :value="d.typeid">{{ d.typeName }}</option>
                    </select>
                </td>
            </tr>

             <tr>
                <td>图片</td>
                <td>
                    <input type="file" @change="addimg">
                    <img :src="'https://localhost:7203/'+data.imgUrl" style="width: 60px;height: 60px;">
                </td>
            </tr>

            <tr>
                <td></td>
                <td>
                    <input type="button" value="提交" @click="add">
                </td>
            </tr>
        </table>

        <a href="/">返回首页</a>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios'
import {ref,onMounted} from 'vue'
import { useRouter } from 'vue-router'
const router=useRouter()

const data=ref({
  "num": "",
  "tid": 0,
  "delTime":null,
  "phone": "",
  "pname": "",
  "typeId": 0,
  "imgUrl": ""
})
//添加
const add=()=>{
    axios.post("https://localhost:7203/api/Room/AddNum",data.value).then(res=>{
        if(res.data>0){
            alert("新增成功");
            router.push("/")
        }
        else if(res.data==-1){
            alert('房号不能重复');
            return;
        }
        else{
            alert('新增失败');
            return;
        }
    })
}

//文件上传
const addimg=(a:any)=>{
    var f=a.target.files[0];
    var fs=new FormData();
    fs.append("file",f);
    debugger
    axios.post("https://localhost:7203/api/Room/GetImg",fs).then(res=>{
        data.value.imgUrl=res.data
    })
}

onMounted(()=>{
    bang()
    bang2()
})
//状态
const xl=ref({})
const bang=()=>{
    axios.get("https://localhost:7203/api/Room/GetStarts").then(res=>{
        xl.value=res.data
    })
}
//类型
const xl2=ref({})
const bang2=()=>{
    axios.get("https://localhost:7203/api/Room/GetType").then(res=>{
        xl2.value=res.data
    })
}
</script>

<style scoped>

</style>